<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<meta name="decorator" content="sysDefault" />
<script src="${staticPath}/lib//jquery/1.10.2/jquery.js" type="text/javascript"></script>
<script src="${staticPath}/lib/ztree/3.5/js/jquery.ztree.all-3.5.js" type="text/javascript"></script>
<link rel="stylesheet" href="${staticPath}/lib/ztree/3.5/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript">

var zNodes;
var _treeNode;
var dragId;
var log, className = "dark",
startTime = 0, endTime = 0, perCount = 100, perTime = 100;
var setting = {
	view: {
		selectedMulti: false,
		fontCss: getFont,
		nameIsHTML: true
	},
	edit: {
		enable: true,
		editNameSelectAll: false,
		showRemoveBtn: setRemoveBtn,
		showRenameBtn: setRemoveBtn
	},

	check: {
		enable: false
	},
	data: {
		simpleData: {
			enable: true
		}
	},
	callback: {
		beforeDrag: beforeDrag,
		beforeRemove: beforeRemove,
		beforeEditName:beforeEditName,
		onClick: onClick,
		onDrop: onDrop,
		beforeDrag: beforeDrag,
		beforeDrop: beforeDrop
		
	}
};
//判断为顶级节点则不显示删除按钮
function setRemoveBtn(treeId, treeNode) {
   if(treeNode.level == 0)
         return false;
   else
         return true;
}
function getFont(treeId, node) {
	return node.font ? node.font : {};
}
function onDrop(event, treeId, treeNodes, targetNode, moveType, isCopy) {
    var jsonObject ="[";
    jsonObject += "{'treeId':'"+targetNode.id+"', 'treeNodes':'"+treeNodes[0].id+"', 'moveType':'"+moveType+"'}";
    jsonObject += "]";
	className = (className === "dark" ? "":"dark");
	$.get("${contextPath}/sys/site/menu/onDrop?json="+jsonObject,function(data){  
	       
	 }); 
}


function getUrl(treeId, treeNode) {
	return "${contextPath}/sys/site/menu/json?treeNodeId="+treeNode.id;
}
function beforeDrag(treeId, treeNodes,moveType) {
	for (var i=0,l=treeNodes.length; i<l; i++) {
		   dragId = treeNodes[i].pId;
		if (treeNodes[i].drag === false) {
			return false;
		}
	}
	return true;
}

function beforeEditName(treeId, treeNode) {
	url='${contextPath}/sys/site/menu/edit?treeid='+treeNode.id+'';
	window.open(url,'_self');
	return false;
}

function beforeRemove(treeId, treeNode) {
	var flag =confirm("确认删除 节点 -- " + treeNode.name + " 吗？")
	if(flag){
		className = (className === "dark" ? "":"dark");
		var zTree = $.fn.zTree.getZTreeObj("menuTree");
		zTree.selectNode(treeNode);
		 $.get("${contextPath}/sys/site/menu/remove?treeId="+treeNode.id+"",function(data){  
		        $('#result').text(data);//直接展示JSON数据
		        zNodes =eval("("+data+")");
		 }); 
	}	
	return flag;
}
function beforeDrop(treeId, treeNodes, targetNode, moveType) {
	
	  if(targetNode.pId == dragId&&moveType!='inner'){
	    return true;
	  }else{
        return false;
      }
}

function onClick(event, treeId, treeNode, clickFlag) {

	if(treeNode.level==4){
		$('#add').attr("disabled", "disabled");
	}else{
		$('#add').removeAttr("disabled");
	}
	_treeNode=treeNode;
	
}
$(document).ready(function(){
		
	var treeType=$('input:radio:checked').val();
    $.get("${contextPath}/sys/site/menu/getNode?treeType="+treeType,function(data){  
        $('#result').text(data);//直接展示JSON数据
        zNodes =eval("("+data+")");
       $.fn.zTree.init($("#menuTree"), setting, zNodes);
   });  
  
});

	function funform(url,target){
		var treeType=$('input:radio:checked').val();
		var treeid;
		if(_treeNode!=null){
			treeid=_treeNode.id
		}
		
		if(treeid==""||typeof(treeid)=="undefined"){
			alert("请选择上级节点");
		}else{
			window.open(url+"?treeid="+treeid+"&treeType="+treeType,target);
		}
	}

	function changeSelect(value){
		  $.get("${contextPath}/sys/site/menu/getNode?treeType="+value,function(data){  
		        $('#result').text(data);//直接展示JSON数据
		        zNodes =eval("("+data+")");
		       $.fn.zTree.init($("#menuTree"), setting, zNodes);
		   });  
	}
</script>
	<style type="text/css">
	.ztree li span.button.switch.level0 {visibility:hidden; width:1px;}
	.ztree li ul.level0 {padding:0; background:none;}
</style>
</head>
<body>
	<div class="container-fluid">
		<div class="row">
			<div class="col-xs-12">
				<div class="panel panel-default">
				  <div class="panel-heading">
				    <h3 class="panel-title">
				    <tags:message content="${message}"/>
				    	菜单管理<span class="glyphicon &{icon}"></span>
				    	<button id="add"  class="btn btn-success btn-sm pull-right" role="button" onclick="funform('${contextPath}/sys/site/menu/add','_self');">新增</button>
				    </h3>
				  </div>
				  		<div class="col-sm-4">
						<ossp:radio dictType="menu" id="treeType"  defaultChecked="${treeType}"  onchange="changeSelect(this.value)" >
						</ossp:radio>
					</div>
				</div>	
			</div>
		</div>
	  <ul id="menuTree" class="ztree" ></ul>		
	</div>
</body>
</html>